<!-- 应用注册审核 -->
<template>
	<zh-space>
		<!-- 查询条件栏 -->
		<zh-card title="查询条件" :bordered="true">
			<zh-form :model="data.formData" ref="queryFormRef">
				<zh-form-select prop="authStatus" label="审核状态" placeholder="请选择" v-model="data.formData.authStatus" :options="data.dict.authDict" />
				<zh-form-input prop="appName" label="应用名称" placeholder="请输入应用名称(模糊查询)" v-model="data.formData.appName" />

				<template v-if="data.advanced">
					<zh-form-input prop="appProjName" label="所属项目" placeholder="请输入所属项目名称(模糊查询)" v-model="data.formData.appProjName" />
					<zh-form-select prop="appType" label="应用类型" placeholder="请选择" v-model="data.formData.appType" :options="data.dict.appTypeDict" />
					<zh-form-select prop="appField" label="应用领域" placeholder="请选择" v-model="data.formData.appField" :options="data.dict.appFieldDict" />
				</template>
				<zh-form-query v-model="data.advanced" @queryClick="query" :formRef="queryFormRef"></zh-form-query>
			</zh-form>
		</zh-card>
		<!-- 查询结果栏 -->
		<zh-table title="" :columns="data.tableColumn" :data="data.tableData" highlight-current-row :height="data.height" ref="queryTable">
			<!-- 操作按钮组 -->
			<template #control_default="{ row }">
				<zh-button link size="small" :style="row.authStatus === '0' ? data.btnBlue : data.btnGrey" style="fontWeight: 500" @click="openDialog(row)"> 审核 </zh-button>
				<!-- <zh-button link size="small" type="primary" style="fontWeight: 600" @click="toAppInfo"> 详情 </zh-button> -->
			</template>
			<template #appstate_default="{ row }">
				<zh-badge :status="data.flagMap[Number(row.authStatus)].status" :text="row.authStatusName" class="badge" />
			</template>
		</zh-table>
		<!-- 审核详情弹窗 -->
		<el-dialog v-model="data.auditDialog" title="应用注册审核" @closed="auditDialogClosed" destroy-on-close :center="true" width="60%">
			<AuditDialog :auditMainInfo="data.toAuditMainObj" @changeAuditDialog="changeDialog"></AuditDialog>
		</el-dialog>
	</zh-space>
</template>
<script lang="ts" setup name="appAudit">
// import { useRouter } from 'vue-router';
import AuditDialog from './components/AuditDialog.vue';
import ZhSpace from '@/components/zh-space/index.vue';

// ------------------定义子组件---------------------------
// const router = useRouter();
const changeDialog = (obj) => {
	data.auditDialog = obj.changeAuditDialog;
};
// -------------------初始化------------------------------
onMounted(() => {
	//searchInfo();
	getDict();
  query();
  initHeight();
});
// ------------------内部变量定义-------------------------
// 表单实例
const queryFormRef = ref<any>();
// 主数据对象
const data = reactive({
	// 表单对象
	formData: {
		busiType: '0' as string,
		appName: '' as string,
		appType: '' as string,
		appField: '' as string,
		authStatus: '0' as string,
		orgName: '' as string,
		appProjName: '' as string,
		devName: '' as string,
	} as any,
	// 查询结果表--表头
	tableColumn: [
		{
			field: 'appInfoId',
			title: '表单明细id',
			visible: false,
			align: 'center',
			minWidth: 80,
		},
		{
			type: 'seq',
			minWidth: 60,
			fixed: 'left',
			align: 'center',
			title: '序号',
		},
		{
			field: 'appName',
			title: '应用名称',
			visible: true,
			align: 'center',
			minWidth: 100,
		},
		{
			field: 'appTypeName',
			title: '应用类型',
			visible: true,
			align: 'center',
			minWidth: 100,
		},
		{
			field: 'builderName',
			title: '建设单位',
			visible: true,
			align: 'center',
			minWidth: 100,
		},
    {
      field: 'exhibitUrl',
      title: '调用应用白名单',
      visible: true,
      align: 'center',
      minWidth: 100,
    },
		{
			field: 'appProjName',
			title: '所属项目',
			visible: true,
			align: 'center',
			minWidth: 100,
		},
    {
			field: 'authStatus',
			title: '审核状态',
			visible: true,
      fixed: 'right',
			align: 'center',
			minWidth: 100,
			slots: {
				default: 'appstate_default',
			},
			filters: [
				{ label: '未审核', value: 0 },
				{ label: '审核通过', value: 1 },
				{ label: '审核未通过', value: 2 },
			],
		},
		{
			field: 'operate',
			title: '操作',
			fixed: 'right',
			align: 'center',
			minWidth: 150,
			slots: {
				// 使用插槽模板渲染
				default: 'control_default',
			},
		},
	] as Array<Object>,
	// 查询结果表--内容
	tableData: [
		{
			id: '' as any,
			appName: '' as string,
			appType: '' as string,
			appField: '' as string,
			authStatus: '' as string,
			orgName: '' as string,
			appProjName: '' as string,
			appDev: '' as string,
    },
	] as Array<Object>,
	// 按钮样式
	btnBlue: 'color: #409EFF' as string,
	btnGrey: 'color: grey;text-decoration: line-through;' as string,
	// 审核弹窗显示状态
	auditDialog: false as boolean,
	// 当前应用审核对象
	toAuditMainObj: {} as any,
	//审核状态图标列表
	flagMap: {
		0: {
			status: 'processing',
		},
		1: {
			status: 'success',
		},
		2: {
			status: 'error',
		},
	},
	// 数据字典对象
	dict: {
		// 审核状态字典
		authDict: [] as Array<any>,
		// 应用领域字典
		appFieldDict: [] as Array<any>,
		// 应用类型字典
		appTypeDict: [] as Array<any>,
	},
  advanced: false,
  // 表格高度
  height: 0 as number
});
// ------------------定义调用方法-------------------------
// 初始化表格高度
const initHeight = () => {
  // 浏览器的视口高度
  const winHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
  data.height = winHeight - 300;
}
// 查询按钮的回调
const query = () => {
  let params = data.formData;
  params.busiType = 'appInfo0010';
	$api.common.send.post('appInfo0007', params).then((res: any) => {
		data.tableData = res.result.list;
	});
};
// 查询数据字典信息
const getDict = () => {
	let params = {
		dictFields: 'AUTHSTATUS,APPTYPE,APPFIELD',
	};
	$api.common.getBatchDict.post(params).then((res: any) => {
		data.dict.authDict = res.result.AUTHSTATUS;
		data.dict.appFieldDict = res.result.APPFIELD;
		data.dict.appTypeDict = res.result.APPTYPE;
	});
};

// // 查询单位应用审核信息
// const searchInfo = () => {
//   let params = {
//     // 业务类型：0（应用注册审核）
//     busiType: 0,
//   }
//   $api.common.send.post('appInfo0007', params).then((res: any) => {
//     data.tableData = res.result.list
//   })
// }
// 跳转至应用详情
// const toAppInfo = () => {
// 	router.push({
// 		path: 'appInfo',
// 		query: {
// 			para: JSON.stringify(data.toAuditMainObj),
// 		},
// 	});
// };
//打开审核弹窗
const openDialog = (row) => {
	data.toAuditMainObj = row;
	if (row.appAppendixShowId) {
		row.appAppendixShowId = $api.common.fileShowUrl.url + row.appAppendixShowId;
	}
	row.authStatus === '0' ? (data.auditDialog = true) : (data.auditDialog = false);
};
// 关闭审核弹窗
const auditDialogClosed = () => {
	query();
};
</script>
<style lang="scss" scoped></style>
